<!DOCTYPE html>
<meta http-equiv="Access-Control-Allow-Origin" content="*" />
<html>
<head>
    <title>平台商品信息表</title>
	<#include "/header.html">
    <script src="https://gosspublic.alicdn.com/aliyun-oss-sdk-6.0.0.min.js"></script>
    <script src="${request.contextPath}/statics/libs/ajaxupload.js"></script>
</head>
<body>
<style>
    .content {
        width: 200px;
        height: 200px;
        position: relative;
        border: 1px solid #cccccc;
        box-shadow: 5px 2px 6px #cccccc;
    }

    .none {
        display: none;
    }

    .uploadImgno {
        cursor: pointer;
    }

    .uploadImgno-img {
        width: 32px;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -16px;
        margin-top: -16px;
    }

    .uploadImgno-p {
        font-family: SourceHanSansCN-Regular;
        font-size: 15px;
        color: #EE3521;
        position: absolute;
        left: 50%;
        top: 50%;
        margin-left: -40px;
        margin-top: 20px;
    }

    .uploadImg {}

    .uploadImg-img {
        width: 200px;
        height: 200px;
    }

    .uploadImg-span {
        background: #FFFFFF;
        border: 1px solid #EE3521;
        border-radius: 3px;
        width: 67px;
        height: 24px;
        line-height: 24px;
        text-align: center;
        font-family: SourceHanSansCN-Regular;
        font-size: 13px;
        color: #EE3521;
        position: absolute;
        right: 15px;
        bottom: 15px;
        cursor: pointer;
    }
</style>
<div id="rrapp" v-cloak>
    <div v-show="showList">
        <div class="grid-btn">
			<#if shiro.hasPermission("sys:bplatformcommodityinfo:save")>
            <a class="btn btn-primary" @click="add"><i class="fa fa-plus"></i>&nbsp;新增</a>
			</#if>
        </div>
        <table id="jqGrid"></table>
        <div id="jqGridPager"></div>
    </div>

    <div v-show="!showList" class="panel panel-default">
        <div class="panel-heading">{{title}}</div>
        <form class="form-horizontal">
                    <div class="form-group">
                        <div class="col-sm-2 control-label">品牌</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" list="brandName" placeholder="品牌" id="brandNames" v-model="brandName" placeholder="品牌"/>
                            <datalist id="brandName" >

                            </datalist>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">商品名称</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="bPlatformCommodityInfo.commodityName" placeholder="商品名称"/>
                        </div>
                    </div>
                    <div class="form-group" style="margin-bottom: 40px;">
                        <div class="col-sm-2 control-label">商品图片</div>
                        <div class="col-sm-10">
                            <div class="content">
                                <div class="uploadImg">
                                    <img class="uploadImg-img" id="img"/>
                                    <a class="btn btn-primary" id="upload"><i class="fa fa-plus"></i>&nbsp;上传图片</a>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">商品描述</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="bPlatformCommodityInfo.commodityDesc" placeholder="商品描述"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">商品价格</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="bPlatformCommodityInfo.commodityPrice" placeholder="商品价格"/>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-2 control-label">商品原价</div>
                        <div class="col-sm-10">
                            <input type="text" class="form-control" v-model="bPlatformCommodityInfo.originalCommodityPrice" placeholder="商品原价"/>
                        </div>
                    </div>
            <div class="form-group">
                <div class="col-sm-2 control-label"></div>
                <input type="button" class="btn btn-primary" @click="saveOrUpdate" value="确定"/>
                &nbsp;&nbsp;<input type="button" class="btn btn-warning" @click="reload" value="返回"/>
            </div>
        </form>
    </div>
</div>
<script src="${request.contextPath}/statics/js/modules/sys/bplatformcommodityinfo.js?_${.now?long}"></script>
<script>
    $(document).ready(function () {
        new AjaxUpload('#upload', {
            action: baseURL + "sys/oss/upload",
            name: 'file',
            autoSubmit:true,
            responseType:"json",
            onSubmit:function(file, extension){

            },
            onComplete : function(file, r){
                if(r.code == 0){
                    $("#img").attr("src",r.url);
                    vm.bPlatformCommodityInfo.commodityImgUrl=r.url;
                    console.log(vm.bPlatformCommodityInfo.commodityImgUrl);
                }else{
                    alert(r.msg);
                }
            }
        });
        // function upload(file) {
        //     var client = new window.OSS({
        //         // region: 'oss-cn-shenzhen', // hangzhou, shanghai, shenzhen
        //         secure: true,
        //         accessKeyId: 'LTAIW4MTd90Wq32F',
        //         accessKeySecret: '7Bft5u5eOGRG47zXX8FCUNIzEOyVyP',
        //         bucket: 'lktvtool',
        //         endpoint:"oss-cn-shenzhen.aliyuncs.com",
        //         origin:"*"
        //     });
        //     var pathname = 'userCommodityImg';
        //     var date = new Date();
        //     var yeaer = date.getFullYear();
        //     var month = date.getMonth() + 1;
        //     var day = date.getDate();
        //     var datePath = yeaer+'_'+month+'_'+day;
        //     var key = pathname+"/"+datePath+"/image"+String(parseInt(Math.random() * 10000000, 10));
        //     client.put(key, file).then(function () {
        //         return client.get(key);
        //     }).then(function(ret){
        //         console.log(ret.res.requestUrls[0]);
        //         vm.bPlatformCommodityInfo.commodityImgUrl=ret.res.requestUrls[0];
        //     // alert('上传成功！');
        // }).catch(function(err){
        //         console.log(err);
        // });
        // }
    });
</script>
</body>
</html>